<template>
  <div>
    <div>
      <van-nav-bar
          title="我参与的活动"
          left-text="返回"
          left-arrow
          @click-left="back()"
      />

    </div>
    <div>
      <h2>您一共参加{{activitys.length}}场活动</h2>
    </div>
    <div>
      <div class="dv1" v-for="a in activitys">
        <van-row>
          <van-col :span="10">
            <img class="img1" :src="a.imgurl">
          </van-col>
          <van-col :span="13">
            <h4 class="dv2">{{ a.title }}</h4>
            <div class="dv2">开始日期：{{ a.sdate }}</div>
            <div class="dv2">结束日期：{{ a.edate }}</div>
            <div class="dv2">
              <div v-if="a.flag==1">
                <van-button class="btn1" type="warn" disabled>等待开始</van-button>
              </div>
              <div v-else-if="a.flag==2">
                <van-button class="btn1" type="primary" >快开始吧</van-button>
              </div>
              <div v-else="a.flag==3">
                <van-button class="btn1" type="danger" >恭喜您完成活动</van-button>
              </div>
            </div>
          </van-col>
        </van-row>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "MyActivityView",
  data(){
    return{
      activitys:[

      ]
    }
  },mounted() {
    this.axios.get("/api/useractivity/all.do").then(r=>{
      if(r.data.code==200){
        this.activitys=r.data.data;
      }
    })
  },
  methods:{
    back(){
      history.back();
    },


  }
}
</script>

<style scoped>
.dv1{
  background-color: ghostwhite;
  width: 90%;
  margin-left: 5%;
  border: 1px solid gainsboro;
  box-shadow: 5px 5px 3px gainsboro;
  border-radius: 20px;
  margin-bottom: 10px;
}
.dv2{
  margin: 5px;
  font-size: 13px;
}
.btn1{
  width: 80%;
  margin-left: 10%;
  border-radius: 20px;
  margin-bottom: 2px;
}
.img1{
  width: 100%;
  height: 100%;
  border-radius: 20px;
}
</style>